<template>
  <div>
    <router-view/>
  </div>
</template>

<script>

import {mapActions, mapState} from "vuex";

export default {
  name: 'App',
  methods: {
    ...mapActions(["initMap", "initGeolocation", "localPosition"]),
    init() {
      //初始化数据
      this.initData()
      //初始化动作
      this.initAction()
    },
    initData() {
      //创建Map实例
      this.initMap(new BMapGL.Map("wolf-map"))
      //创建定位
      this.initGeolocation(new BMapGL.Geolocation())
    },
    initAction() {
      //定位当前位置
      this.localPosition()
    },
    initState() {
      let STATE = "state"
      //在页面加载时读取sessionStorage里的状态信息
      let state = sessionStorage.getItem(STATE);
      if (state) {
        this.$store.replaceState(Object.assign(this.$store.state, JSON.parse(state)));
        sessionStorage.removeItem(STATE)
      }
      //在页面刷新时将vuex里的信息保存到sessionStorage里
      window.addEventListener('beforeunload', () => {
        sessionStorage.setItem(STATE, JSON.stringify(this.$store.state));
      });
    },

  },
  computed: {
    ...mapState(["map", "geolocation"])
  },
  created() {
    this.initState();
  },
  mounted() {
    this.init()
  }
}
</script>


